<template>
 <div>
  <MyProduct title="超级好吃的口水鸡儿" price="29" :info="msg"></MyProduct>
  <MyProduct title="香喷喷的脆皮鸭" price="49" info="香脆可口"></MyProduct>

  <my-product
   v-for="item in list" 
   :key="item.id" 
   :title="item.pronae" 
   :price="item.proprice" 
   :info="msg" 
   :id="item.id" 
   @sayPrice="kanjia">
  </my-product>
 </div>
</template>
<script>
//引入
import MyProduct from './components/MyProduct.vue'
export default {
  //2.注册
  components: {
    MyProduct
  },
 data() {
 return {
  msg:'鲜嫩多汁!',
  list: [
        { id: 1, proname: '超级好吃的棒棒糖', proprice: 18.8 },
        { id: 2, proname: '超级好吃的大鸡腿', proprice: 34.2 },
        { id: 3, proname: '超级无敌的冰激凌', proprice: 14.2 }
      ] 
 }
 },
 methods:{
  kanjia(num,id){
    //砍价思路
    //1.先根据id找到元素find
    //2.修改对象proprice属性即可砍价
    const item=this.list.find(item=>item.id===id)
    item.proprice-=num
  }
 },
}
</script>
<style>

</style>
